<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>风盾金控服务平台-首页</title>
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<link th:href="@{/loanStatic/home/css/cate.css}" rel="stylesheet" type="text/css" />
<link th:href="@{/loanStatic/home/css/iscroll.css}" rel="stylesheet" type="text/css" />
<script type="text/javascript" th:src="@{/loanStatic/home/js/iscroll.js}"></script>
<script type="text/javascript">
var myScroll;
	function loaded() {
		myScroll = new iScroll('wrapper', {
			snap: true,
			momentum: false,
			hScrollbar: false,
			onScrollEnd: function () {
			document.querySelector('#indicator > li.active').className = '';
			document.querySelector('#indicator > li:nth-child(' + (this.currPageX+1) + ')').className = 'active';
		}
	});
 
}
document.addEventListener('DOMContentLoaded', loaded, false);
</script>

</head>

<body style="background:#1b5d93;">

<!-- <style type="text/css">
.btn_music{display:inline-block;width:35px;height:35px;background:url('/loanStatic/home/images/play.png') no-repeat center center;background-size:100% auto;position:absolute;z-index:100;left:15px;top:20px;}
.btn_music.on{background-image:url("/loanStatic/home/images/stop.png");}
</style> -->

<script type="text/javascript" th:src="@{/loanStatic/home/js/jquery.min.js}"></script>
<!-- <script type="text/javascript">

var playbox = (function(){
	//author:eric_wu
	var _playbox = function(){
		var that = this;
		that.box = null;
		that.player = null;
		that.src = null;
		that.on = false;
		//
		that.autoPlayFix = {
			on: true,
			//evtName: ("ontouchstart" in window)?"touchend":"click"
			evtName: ("ontouchstart" in window)?"touchstart":"mouseover"
			
		}

	}
	_playbox.prototype = {
		init: function(box_ele){
			this.box = "string" === typeof(box_ele)?document.getElementById(box_ele):box_ele;
			this.player = this.box.querySelectorAll("audio")[0];
			this.src = this.player.src;
			this.init = function(){return this;}
			this.autoPlayEvt(true);
			return this;
		},
		play: function(){
			if(this.autoPlayFix.on){
				this.autoPlayFix.on = false;
				this.autoPlayEvt(false);
			}
			this.on = !this.on;
			if(true == this.on){
				this.player.src = this.src;
				this.player.play();
			}else{
				this.player.pause();
				this.player.src = null;
			}
			if("function" == typeof(this.play_fn)){
				this.play_fn.call(this);
			}
		},
		handleEvent: function(evt){
			this.play();
		},
		autoPlayEvt: function(important){
			if(important || this.autoPlayFix.on){
				document.body.addEventListener(this.autoPlayFix.evtName, this, false);
			}else{
				document.body.removeEventListener(this.autoPlayFix.evtName, this, false);
			}
		}
	}
	//
	return new _playbox();
})();

playbox.play_fn = function(){
	this.box.className = this.on?"btn_music on":"btn_music";
}
</script> -->
<!-- <script type="text/javascript">
$(document).ready(function(){
	playbox.init("playbox");
	/*
	setTimeout(function() {
		// IE
		if(document.all) {
			document.getElementById("playbox").click();
		}
		// 其它浏览器
		else {
			var e = document.createEvent("MouseEvents");
			e.initEvent("click", true, true);
			document.getElementById("playbox").dispatchEvent(e);
		}
	}, 2000);
	*/
});

</script> -->
<!-- <span id="playbox" class="btn_music" onclick="playbox.init(this).play();">
	<audio id="audio" loop th:src="@{/loanStatic/home/images/4.mp3}"></audio>
</span> -->

<div class="banner">
	<div id="wrapper">
		<div id="scroller">
			<ul id="thelist">
				<li>
					<p>借款产品02</p>
					<a href="javascript:void(0)"><img th:src="@{/loanStatic/home/images/3.jpg}" /></a>
				</li>
				<li>
					<p>借款产品02</p>
					<a href="javascript:void(0)"><img th:src="@{/loanStatic/home/images/4.jpg}" /></a>
				</li>
				<li>
					<p>借款产品03</p>
					<a href="javascript:void(0)"><img th:src="@{/loanStatic/home/images/2.jpg}" /></a>
				</li>
				<li>
					<p>借款产品04</p>
					<a href="javascript:void(0)"><img th:src="@{/loanStatic/home/images/1.jpg}" /></a>
				</li>
			</ul>
		</div>
	</div>
	<div id="nav">
		<ul id="indicator">
			<li class="active"></li>
			<li></li>
			<li></li>
			<li></li>
		</ul>
	</div>
	<div class="clr"></div>
</div>
<ul class="mainmenu">
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb02.png}" /><span>借款产品01</span></p><b>借款产品01</b></a></li>
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb08.png}" /><span>借款产品02</span></p><b>借款产品02</b></a></li>
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb07.png}" /><span>借款产品03</span></p><b>借款产品03</b></a></li>
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb03.png}" /><span>借款产品04</span></p><b>借款产品04</b></a></li>
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb01.png}" /><span>借款产品05</span></p><b>借款产品05</b></a></li>
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb03.png}" /><span>借款产品06</span></p><b>借款产品06</b></a></li>
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb02.png}" /><span>借款产品07</span></p><b>借款产品07</b></a></li>
	<li><a href="/" ><p><img th:src="@{/loanStatic/home/images/tb04.png}" /><span>借款产品08</span></p><b>借款产品08</b></a></li>	
</ul>   
<script type="text/javascript">
var count = document.getElementById("thelist").getElementsByTagName("img").length;	

var count2 = document.getElementsByClassName("menuimg").length;
for(i=0;i<count;i++){
 document.getElementById("thelist").getElementsByTagName("img").item(i).style.cssText = " width:"+document.body.clientWidth+"px";

}
document.getElementById("scroller").style.cssText = " width:"+document.body.clientWidth*count+"px";

 setInterval(function(){
myScroll.scrollToPage('next', 0,400,count);
},3500 );
window.onresize = function(){ 
for(i=0;i<count;i++){
document.getElementById("thelist").getElementsByTagName("img").item(i).style.cssText = " width:"+document.body.clientWidth+"px";

}
 document.getElementById("scroller").style.cssText = " width:"+document.body.clientWidth*count+"px";
} 
</script>

<br />
<div class="copyright">
联系方式：0591-88888888<br />

地址：福建省平潭xxxxxxx<br />

闽ICPxxxxxxx<br />

</div><br /><br />

<style type="text/css">
.top_bar{position:fixed;z-index:900;bottom:-1px;left:0;right:0;}
.top_menu{
	border-top:1px solid #b3b3b3;width:100%;height:40px;margin:0;padding:0;
	
	background:rgba(255, 255, 255, 0.7);
	background:-webkit-gradient(linear, 0 0, 0 100%, from(#e7e4e7), to(#b9b9b9));
	background:-o-gradient(linear, 0 0, 0 100%, from(#e7e4e7), to(#b9b9b9));
	background:gradient(linear, 0 0, 0 100%, from(#e7e4e7), to(#b9b9b9));
}
.top_bar .top_menu>li{
	position:relative;text-align:center;display:inline-block;width:25%;float:left;
	
	background:-webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2))), -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.1)), color-stop(50%, rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.1)));
	background:-o-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2))), -o-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.1)), color-stop(50%, rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.1)));
	background:gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.1)), color-stop(50%, rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2))), gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.1)), color-stop(50%, rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.1)));
}
.top_bar .top_menu li a label{padding:3px 0 0 3px;font-size:12px;overflow:hidden;}
/* .top_menu>li:first-child{} */
.top_bar .top_menu>li>a{height:40px;line-height:40px;display:block;text-align:center;color:#4f4d4f;text-shadow:0 1px rgba(255, 255, 255, 0.3);text-decoration:none;border-top:1px solid #f9f9f9;}
.top_bar .top_menu>li>a p{overflow:hidden;margin:0 0 0 0;font-size:12px;display:block!important;line-height:18px;text-align:center;}
.top_bar .top_menu>li>a img{padding:0;height:20px;width:20px;color:#fff;line-height:40px;vertical-align:middle;}
.top_bar .top_menu>li>a:hover,.top_bar .top_menu>li>a:active{background-color:#CCCCCC;}

/*微信分享开始*/
#mcover{ position: fixed; top:0;  left:0; width:100%; height:100%;background:rgba(0, 0, 0, 0.7);  display:none;z-index:20000;}
#mcover img {position: fixed;right: 18px;top:5px;width: 260px;height: 180px;z-index:20001;}
.img{
  width: 100%;
  min-width: 100%;
  height: 50px;
  margin:0 auto;
  text-align: center;
  font-size: 20px;
}
/*微信分享结束*/
</style>

<div class="top_bar">
	<div id="mcover" onClick="document.getElementById('mcover').style.display='';" style="">
		<img th:src="@{/loanStatic/images/share.png}">
	</div>
	<nav>
		<ul id="top_menu" class="top_menu">
			<li onclick="homeBtn();" style="background:none;">
				<a>
					<img th:src="@{/loanStatic/home/images/plugmenu6.png}"/>
					<label>首页</label>
				</a>
			</li>
			<li onclick="productBtn();">
				<a>
					<img th:src="@{/loanStatic/home/images/chaopin.png}"/>
					<label>产品</label>
				</a>
			</li>
			<li onclick="myCenterBtn();">
				<a>
					<img th:src="@{/loanStatic/home/images/plugmenu1.png}"/>
					<label>我的</label>
				</a>
			</li>
			<li onClick="document.getElementById('mcover').style.display='block';">
				<a>
					<img th:src="@{/loanStatic/home/images/plugmenu5.png}"/>
					<label >分享</label>
				</a>
			</li>  
		</ul>
	</nav>
</div>
<script>
function productBtn(){
	window.location.href='/moblie/product'
}
function homeBtn(){
	window.location.href='/moblie/home'
}
function myCenterBtn(){
	window.location.href='/moblie/userCenterFrom'
}
</script>
</body>
</html>